$(function() {
    // $('p').on('click', function() {
    //     $(this).css('background', 'yellow')
    // })
    /******************静态事件区************* */
    let count = 7;
    let offset = 0;
    $('.panel-heading').hover(function() {
        $(this).toggleClass('bor')
    })
    $('.pagination li').click(function() {
        $('.pagination li').removeClass('active').removeAttr('aria-current')
        $(this).addClass('active').attr('aria-current', 'page')
    })
    $('#esc-user').click(function() {
        // alert(0)
        var msg = '您是否确定要退出当前操作！'
        if (confirm(msg) == true) {
            location.href = '/login'
            return true
        }
    });


    /******************************* */


    /*************先获取token再获取获取用户信息***************** */
    getUserInfo();

    function getUserInfo() {
        let token = sessionStorage.getItem('_tk')
        if (!token) {
            //token不存在返回登录页面
            location.href = '/login';
            return
        }

        $.ajax({
            type: 'POST',
            url: 'http://localhost:5001/userInfo',
            data: {
                token
            },
            success(result) {
                console.log(result)
                if (result.code == 303) {
                    if (confirm('您的身份信息已过期，请重新登录')) {
                        location.href = '/login'
                    }

                }
                if (result.code == 400) {
                    $('#user-img').attr('src', result.result[0].url)
                    $('#username').html(result.result[0].user)
                }

            }

        })
    }
    /*********************************** */





    /**************创建一个处理时间的类******************************* */
    class TimeUtils {
        formatDate(value) {
            let date = new Date(value);
            let year = date.getFullYear();
            let month = date.getMonth() + 1;
            month = month >= 10 ? month : '0' + month;
            let day = date.getDate();
            day = day >= 10 ? day : '0' + day;
            let hours = date.getHours();
            hours = hours >= 10 ? hours : '0' + hours;
            let minutes = date.getMinutes();
            minutes = minutes >= 10 ? minutes : '0' + minutes;
            let seconds = date.getSeconds();
            seconds = seconds >= 10 ? seconds : '0' + seconds;
            return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
        }
    }
    let timeUtils = new TimeUtils;
    /****************************************** */



    /******************初始化获取商品数据总数*************************** */
    // getTypeData();

    function getTypeData1() {
        let token = sessionStorage.getItem('_tk')
        if (!token) {
            //token不存在返回登录页面
            location.href = '/login';
            return
        }
        //获取搜索类型名称
        let data = {
            token,
            count,
            offset,
        }
        let typename = $('#typename1').val();

        if (typename.trim() !== '') {
            // alert(typename)
            data.typename = typename

        }
        // console.log(data)

        $.ajax({
            type: 'GET',
            url: 'http://localhost:5001/findType',
            data,
            success(result) {
                console.log(result)
                if (result.msg == '查询数据类型成功') {
                    $('tbody').empty()

                    result.result.forEach((obj, i) => {
                        obj.created_at = timeUtils.formatDate(obj.created_at)
                        obj.updated_at = timeUtils.formatDate(obj.updated_at)
                        let tr = `<tr id="${obj.shop_type_id}">
                        <th scope="row" class="nums">${i+1}</th>
                        <td  class='t-name'>${obj.shop_type_name}</td>
                        <td class="status">${obj.status==1?'启用':'禁用'}</td>
                        <td>${obj.created_at}</td>
                        <td>${obj.updated_at}</td>
                        <td>
                            <button type="button" class="btn btn-primary btn-sm edited" >编辑</button>
                            <button type="button" class="btn btn-warning btn-sm ${obj.status==1?'':'hides'}" id="disable-btn">禁用</button>
                            <button type="button" class="btn btn-secondary btn-sm ${obj.status==0?'':'hides'}" id="enable-btn">启用</button>
                            <button type="button" class="btn btn-danger  btn-sm remove-btn">删除</button>
                        </td>
                        </tr>`;
                        $('tbody').append(tr)
                    })

                }

            }

        })
    }
    $('#basic-addon2').on('click', function() {
        // getTypeData()
    });

    /********************分页处理区**************************** */
    let lastactiveid = 'item8'
    let currentpage = 1;
    let totalpage = 0;
    $('.pagination').on('click', '.page-item', function() {
        //控制上下页的禁用启用
        if ($(".pagination .active ").prev().attr('id') !== 'prevpage') {
            $('#prevpage').removeClass('disabled')
        } else {
            $('#prevpage').addClass('disabled')
        }
        if ($(".pagination .active ").attr('id') == lastactiveid) {
            $("#nextpage").addClass('disabled')
        } else {
            $("#nextpage").removeClass('disabled')
        }
        $('.page-item').removeClass('active').removeAttr('aria-current')
        $(this).addClass('active').attr('aria-current', "current")
        console.log($('.pagination .active a').text())
            // count = 3 * ();
        offset = count * ($('.pagination .active a').text() - 1)
            // getTypeData()
    });
    $('#nextpage').on('click', function() {
        if ($('.active').attr('id') == lastactiveid) {
            return
        }
        $('.active').removeClass('active').removeAttr('aria-current')
            .next('.page-item').addClass('active').attr('aria-current', "current")
        offset += count
        currentpage += 1
            // getTypeData()
            // console.log(offset, currentpage)

    })
    $('#prevpage').on('click', function() {
        if ($('.active').attr('id') == 'item1') {
            return
        }
        $('.active').removeClass('active').removeAttr('aria-current')
            .prev('.page-item').addClass('active').attr('aria-current', "current")
        offset -= count
        currentpage -= 1
            // getTypeData()
            // console.log(offset, currentpage)
    })




    /**************************爆炸图处理区********************* */
    $(' tr td:nth-child(5)').click(function() {
        // alert(0)
        $('#main').show();
        $('.index').fadeTo('slow', 0.15)
    })
    $('#close').click(function() {
        $('#main').hide();
        $('.index').fadeTo('slow', 1)
    });
    $('#main').hide()
    var picnum = 0;
    var style = 0;
    var totalimg = $('.littlepics').length
    console.log(totalimg)
    $(document).ready(function() {
        for (var j = 0; j < totalimg; j++) {
            var imgurl = mypics.pics[j].url;
            $("#lipic" + (j + 1)).attr("src", imgurl);
        }
        changeimg();
        goin();
        $("#main").bind("mousewheel", function(event, delta) {
            delta < 0 ? picnum++ : picnum--;
            changeimg();
            goin();
        });
        $(".navli").click(function() {
            style = $(this).val();
            $(this).css("background", "#000").siblings().css("background", "#0cf");

        });
        $(".littlepics").click(function() {
            var altnum = $(this).attr("alt");
            picnum = altnum;
            changeimg();
            goin();
        });
        $("#pre").click(function() {
            picnum--;
            changeimg();
            goin();
        });
        $("#next").click(function() {
            picnum++;
            changeimg();
            goin();
        });

    });

    function goin() {
        $(".pics").hide();
        var i = 0;
        switch (style) {
            case 0:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).fadeIn(500);
                    if (i == 12) {
                        clearTimeout(timer);
                    }
                }, 100);
                break;
            case 1:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).show(500);
                    if (i == 12) {
                        clearTimeout(timer);
                    }
                }, 100);
                break;
            case 2:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).slideDown(500);
                    if (i == 12) {
                        clearTimeout(timer);
                    }
                }, 100);
                break;
            case 3:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).show().addClass("style4");
                    if (i == 14) {
                        clearTimeout(timer);
                        $(".pics").removeClass("style4");
                    }
                }, 100);
                break;
            case 4:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).show().addClass("style5");
                    if (i == 14) {
                        clearTimeout(timer);
                        $(".pics").removeClass("style5");
                    }
                }, 100);
                break;
            case 5:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).show().addClass("style6");
                    if (i == 14) {
                        clearTimeout(timer);
                        $(".pics").removeClass("style6");
                    }
                }, 100);
                break;
            case 6:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).show().addClass("style6");
                    if (i == 14) {
                        clearTimeout(timer);
                        $(".pics").removeClass("style6");
                    }
                }, 100);
                break;
            case 7:
                var timer = setInterval(function autodo() {
                    i++;
                    $("#pc" + i).show().addClass("style6");
                    if (i == 14) {
                        clearTimeout(timer);
                        $(".pics").removeClass("style6");
                    }
                }, 100);
                break;
        }

    }

    function changeimg() {
        if (picnum < 0) {
            picnum = 0;
        } else if (picnum > totalimg) {
            picnum = totalimg;
        }
        var imgurl = mypics.pics[picnum].url;
        $(".pics").css("background-image", "url(" + imgurl + ")");
    }
    var mypics = {
        "pics": [{
                "url": "/img/first.jpg"
            }, {
                "url": "/img/second.jpg"
            }, {
                "url": "/img/three.jpg"
            }, {
                "url": "/img/four.jpg"
            }, {
                "url": "/img/five.jpg"
            }, {
                "url": "/img/five.jpg"
            }, {
                "url": "/img/five.jpg"
            }, {
                "url": "/img/five.jpg"
            }

            /*{"url": "images/82EC0A563613956A9E8B4811BB60F9F603052586F2C23_800_450.JPEG"},
            {"url": "images/4CD747C612005CD508E02FE5D1B56C84620DC2F17A58B_800_450.JPEG"},
            {"url": "images/81463F7890FF1BDABA708996FCD0401CFE58993C881F8_800_450.JPEG"},
            {"url": "images/42A41E817EDB0B709492012F69396C96998BF91306E9B_800_450.JPEG"},
            {"url": "images/08E6FDA15296B8712013BC81F85262BEAF2ECF5492FA2_800_450.JPEG"}
    */
        ]
    };
    /*************************************************** */
})